<%@ page pageEncoding='UTF-8'%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<s:set var="contextPath" value="#request.get('javax.servlet.forward.context_path')" scope="request" />
<!DOCTYPE html>
<head>
    <title>Drug Stock Details</title>
    <%-- header --%>
    <jsp:include page="/WEB-INF/content/common/Header.jsp" flush="true"/>
    <script src="${contextPath}/js/drugstock/drugstock.js"></script>
</head>
<body class="metro view">
	<%-- tob-bar --%>
    <jsp:include page="/WEB-INF/content/common/TopBar.jsp" flush="true"/>
       	
	<div id="main-container" class="body-wrapper">
        <%-- tob-container --%>
    	<jsp:include page="/WEB-INF/content/common/TopContainer.jsp" flush="true"/>
        
    	<div id="body-container">
        	<div id="drugstock-detail-container" class="detail-container">
        		 <%-- header-container --%>
                	<s:set var="mode" value="'details'"/>
	   				<jsp:include page="/WEB-INF/content/drugstock/DrugStockMenuContainer.jsp" flush="true"/>
        		
        		<div id="drugstock-detail-tile-container">
        			<div class="main-detail-tile-container tile triple double-vertical no-link bg-teal">
	        			<div class="detail-inner-tile-container">
                        	<div class="detail-inner-tile">
	               				<label>Drug</label>
	               				<div class="header">${guiDrugStock.drug.name}</div>
	               			</div>
                            </br>
	        				<div class="detail-inner-tile place-left">
	               				<label>Stock ID</label>
	               				<div class="subheader">${guiDrugStock.drugStockId}</div>
	               			</div>
	        				<div class="detail-inner-tile place-right">
	               				<label>Order Amount</label>
	               				<div class="subheader">${guiDrugStock.orderAmount}</div>
	               			</div>
                            <div class="detail-inner-tile place-right">
	               				<label>Stock Amount</label>
	               				<div class="subheader">${guiDrugStock.stockAmount}</div>
	               			</div>
	               			<div class="detail-inner-tile place-left">
	               				<label>Expire Date</label>
	               				<div class="subheader">${guiDrugStock.expireDateString}</div>
	               			</div>
	        			</div>
        			</div>
                    
                    <div class="tile double half-vertical no-link ${guiDrugStock.daysLeft > 0 ? 'bg-green' : 'bg-red'} meta-info-container">
                    	<s:if test="%{guiDrugStock.daysLeft > 0}">
                        	<h3 class="no-margin">
                            	<span class=" icon-thumbs-up"></span>
                                <span class="subheader"> Good</span>
                            </h3>                             
                        </s:if>
                        <s:else>
                            <h3 class="no-margin">
                            	<span class=" icon-thumbs-down"></span>
                                <span class="subheader">Expired</span>
                            </h3>
                        </s:else>
					</div>
	                <div class="tile double half-vertical no-link meta-info-container bg-lime">
                        <s:if test="%{guiDrugStock.daysLeft > 0}">
                            <span class="subheader">${guiDrugStock.daysLeft}</span> days left
                        </s:if>
                        <s:else>
                            <span class="subheader">${guiDrugStock.daysLeft * -1}</span> days pass
                        </s:else>
	                </div>
                    
      				<a href="${contextPath}/drug/show?id=${guiDrugStock.drug.drugId}">
	        			<div class="tile double header meta-info-container bg-violet">
	        				<label class="subheader-secondary">drug</label>
		        			<i class="icon-arrow-right-3 fg-white smaller"></i>
	        			</div>
       				</a>
        			<br clear="all"/>
   
        		</div>
    		</div>    
    	</div>
        
        <%-- bottom-container --%>
    	<jsp:include page="/WEB-INF/content/common/BottomContainer.jsp" flush="true"/>
        
	</div>
    
    <%-- footer-container --%>
    <jsp:include page="/WEB-INF/content/common/FooterContainer.jsp" flush="true"/>
    
</body>
</html>
